<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
  <head>
    <th:block th:include="include :: header('修改绘声绘影动态')" />
    <th:block th:include="include :: summernote-css" />
  </head>
  <body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
      <form
        class="form-horizontal m"
        id="form-dynamic-edit"
        th:object="${djGraphicDynamic}"
      >
        <input name="id" th:field="*{id}" type="hidden" />
        <div class="form-group">
          <label class="col-sm-3 control-label is-required">动态标题：</label>
          <div class="col-sm-8">
            <input
              name="title"
              th:field="*{title}"
              class="form-control"
              type="text"
              maxlength="255"
              required
            />
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3 control-label is-required">发布者：</label>
          <div class="col-sm-8">
            <input
              name="publisher"
              th:field="*{publisher}"
              class="form-control"
              type="text"
              maxlength="100"
              required
            />
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3 control-label">审核状态：</label>
          <div class="col-sm-8">
            <select name="auditFlag" class="form-control">
              <option th:selected="*{auditFlag == 0}" value="0">待审核</option>
              <option th:selected="*{auditFlag == 1}" value="1">已通过</option>
              <option th:selected="*{auditFlag == 2}" value="2">已拒绝</option>
            </select>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3 control-label is-required">动态内容：</label>
          <div class="col-sm-8">
            <textarea
              name="content"
              class="form-control summernote"
              th:field="*{content}"
              required
            ></textarea>
          </div>
        </div>
      </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: summernote-js" />
    <script type="text/javascript">
      var prefix = ctx + "hui/interact/graphic";
      $("#form-dynamic-edit").validate({
        focusCleanup: true,
      });

      function submitHandler() {
        if ($.validate.form()) {
          // 获取富文本内容
          var content = $(".summernote").summernote("code");
          var data = $("#form-dynamic-edit").serializeArray();

          // 更新content字段
          for (var i = 0; i < data.length; i++) {
            if (data[i].name === "content") {
              data[i].value = content;
              break;
            }
          }

          // 转换为对象
          var formData = {};
          $.each(data, function (i, field) {
            formData[field.name] = field.value;
          });

          $.ajax({
            cache: true,
            type: "POST",
            url: prefix + "/edit",
            contentType: "application/json",
            data: JSON.stringify(formData),
            success: function (result) {
              $.operate.successCallback(result);
            },
          });
        }
      }

      $(function () {
        // 初始化富文本编辑器
        $(".summernote").summernote({
          height: 300,
          lang: "zh-CN",
          callbacks: {
            onImageUpload: function (files) {
              // 这里可以实现图片上传功能
              var file = files[0];
              var reader = new FileReader();
              reader.onload = function (e) {
                $(".summernote").summernote("insertImage", e.target.result);
              };
              reader.readAsDataURL(file);
            },
          },
        });
      });
    </script>
  </body>
</html>
